﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>原生json格式化及高亮</title>
<meta name="description" content="json,格式化,高亮">
<meta name="keywords" content="json,格式化,高亮">
<script src="c.js" type="text/javascript"></script>
<link href="s.css" type="text/css" rel="stylesheet" />
<link href="../../css/bootstrap.css" rel="stylesheet" />
</head>
<body style="background:transparent">
<div class="HeadersRow">
  <h3 id="HeaderSubTitle">JSON格式化及高亮:</h3>
  <textarea id="RawJson">[{"name":"John","age":25},{"name":"John","age":25}]</textarea>
</div>
<div class="operateTB form-inline">
	<label for="TabSize">缩进量：</label>
	<select id="TabSize" onchange="TabSizeChanged()" class="span1">
      <option value="1">1</option>
      <option value="2" selected="true">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
      <option value="6">6</option>
    </select>
	<label for="QuoteKeys" class="checkbox">
		<input type="checkbox" id="QuoteKeys" onclick="QuoteKeysClicked()" checked="true">引号
  	</label>
	<span id="CollapsibleViewHolder">
      <label for="CollapsibleView" class="checkbox">
        <input type="checkbox" id="CollapsibleView" onclick="CollapsibleViewClicked()" checked="true">显示控制
      </label>
  </span>
  <span id="CollapsibleViewDetail" style="visibility: visible;margin-right:10px; ">
    <a href="javascript:void(0);" onclick="ExpandAllClicked()">展开</a>
    <a href="javascript:void(0);" onclick="CollapseAllClicked()">叠起</a>
    <a href="javascript:void(0);" onclick="CollapseLevel(3)">2级</a>
    <a href="javascript:void(0);" onclick="CollapseLevel(4)">3级</a>
    <a href="javascript:void(0);" onclick="CollapseLevel(5)">4级</a>
    <a href="javascript:void(0);" onclick="CollapseLevel(6)">5级</a>
    <a href="javascript:void(0);" onclick="CollapseLevel(7)">6级</a>
    <a href="javascript:void(0);" onclick="CollapseLevel(8)">7级</a>
    <a href="javascript:void(0);" onclick="CollapseLevel(9)">8级</a>
  </span>
  <input class="btn btn-small btn-primary" data-loading-text="正在格式化json..." id="format" type="button" onclick="Process()" value="格式化">
</div>
<div class="bottomBar">
    <div class="title">格式化JSON：</div>
	<div id="Canvas" class="Canvas well" style="overflow:auto;"></div>
</div>
</body>
</html>

